<template>
    <div class="reminder-dialog check_member_box">
        <el-dialog
                center
                width="900px"
                title="会员信息修改"
                :visible.sync="visible"
                :close-on-click-modal="false"
                :close-on-press-escape="false"
                @closed="onCloseDialog">
            <el-form label-width="150px" :rules="validateRules" ref="memberForm" :model="formData" size="small" class="member_check_box">
                <el-collapse v-model="activeNames" @change="handleChange">
                    <el-collapse-item name="1" v-if="customerInfo != undefined">
                        <template slot="title">
                            联系人 <el-button size="small" type="primary" class="up_down_text">{{activeNames.indexOf('1') > -1 ? '收起' : '展开'}}<i :class="[activeNames.indexOf('1') > -1 ? 'el-icon-arrow-up' : 'el-icon-arrow-down']"></i></el-button>
                            <!--<el-button size="small" type="primary" class="up_down_text" v-if="activeNames.indexOf('1') > -1">收起 <i class="iconfont el-icon-arrow-up"></i></el-button>-->
                            <!--<el-button size="small" type="primary" class="up_down_text" v-if="activeNames.indexOf('1') < 0">展开 <i class="iconfont el-icon-arrow-down"></i></el-button>-->
                        </template>
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="图片">
                                    <img width='227' height='143' @click="openPreview(customerInfo.frontPhotoAddress)" :src="customerInfo.frontPhotoAddress"/>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <img width='227' height='143' @click="openPreview(customerInfo.backPhotoAddress)" :src="customerInfo.backPhotoAddress"/>
                            </el-col>
                        </el-row>
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="姓名">
                                    <el-input type="text" v-model="customerInfo.customerName"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="手机号">
                                    <el-input type="text" v-model="customerInfo.phoneNumber" readonly disabled></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="性别">
                                    <el-radio-group v-model="customerInfo.sex">
                                        <el-radio-button label="男"></el-radio-button>
                                        <el-radio-button label="女"></el-radio-button>
                                    </el-radio-group>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="身份证号">
                                    <el-input type="text" v-model="customerInfo.idNumber"></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="电子邮箱">
                                    <el-input type="email" v-model="customerInfo.email"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="交易地点">
                                    <!--{{`${customerInfo.tradeLocationProvince}/-->
                                    <!--${customerInfo.tradeLocationCity}/-->
                                    <!--${customerInfo.tradeLocation}`}}-->
                                    <!--<FormAddress ref="customerAddressArray" v-model="customerInfo.customerAddressArray"></FormAddress>-->
                                    <el-cascader
                                            :options="cities"
                                            :props="props"
                                            @active-item-change="handleItemChange"
                                            @change="change"
                                            :value="initValue"
                                            class="get-addr"
                                    >
                                    </el-cascader>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row>
                            <el-col :span="20">
                                <el-form-item label="详细地址">
                                    <el-input type="text" v-model="customerInfo.contactAddress"></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                    </el-collapse-item>
                    <el-collapse-item name="2" v-show="memberState >= 2">
                        <template slot="title">
                            机构认证 <el-button size="small" type="primary" class="up_down_text">{{activeNames.indexOf('2') > -1 ? '收起' : '展开'}}<i :class="[activeNames.indexOf('2') > -1 ? 'el-icon-arrow-up' : 'el-icon-arrow-down']"></i></el-button>
                        </template>
                        <el-row>
                            <el-col :span="8">
                                <img width='227' height='143' @click="openPreview(enterpriseInfo.credentialPhotoAddress)" :src="enterpriseInfo.credentialPhotoAddress"/>
                            </el-col>
                            <el-col :span="8">
                                <img width='227' height='143' @click="openPreview(enterpriseInfo.artificialPersonFrontPhotoAddress)" :src="enterpriseInfo.artificialPersonFrontPhotoAddress"/>
                            </el-col>
                            <el-col :span="8">
                                <img width='227' height='143' @click="openPreview(enterpriseInfo.artificialPersonBackPhotoAddress)" :src="enterpriseInfo.artificialPersonBackPhotoAddress"/>
                            </el-col>
                        </el-row>
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="统一社会信用代码">
                                    <el-input type="text" v-model="enterpriseInfo.unifiedSocialCreditCode"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="营业执照注册号">
                                    <el-input type="text" v-model="enterpriseInfo.licenceRegisterNo"></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="组织机构代码">
                                    <el-input type="text" v-model="enterpriseInfo.organizationCodeNumber"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="营业执照名称">
                                    <el-input type="text" v-model="enterpriseInfo.licenceName"></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="法定代表人住址">
                                    <el-input type="text" v-model="enterpriseInfo.licenceAddr"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="法定代表人姓名">
                                    <el-input type="text" v-model="enterpriseInfo.legalName"></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="法人身份证号码">
                                    <el-input type="text" v-model="enterpriseInfo.legalCertNo"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="纳税人名称">
                                    <el-input type="text" v-model="enterpriseInfo.taxCertName"></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="企业类型">
                                    <el-input type="text" v-model="enterpriseInfo.licenceType"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="公司成立日期">
                                    <el-date-picker
                                            v-model="enterpriseInfo.foundedDate"
                                            type="date"
                                            class="formSelect"
                                            placeholder="选择日期">
                                    </el-date-picker>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="营业执照类型">
                                    <el-select v-model="enterpriseInfo.licenceRegisterTypeId" placeholder="请选择" class="formSelect" value-key="value">
                                        <el-option
                                                v-for="item in licenceRegisterType"
                                                :key="item.value"
                                                :label="item.label"
                                                :value="item.value">
                                        </el-option>
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="企业编号">
                                    <el-input type="text" v-model="enterpriseInfo.corpId"></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row class="otherInfo">
                            其他信息
                        </el-row>
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="ID">
                                    <el-input type="text" v-model="enterpriseInfo.enterpriseId"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="关联中介">
                                    <el-input type="text" v-model="enterpriseInfo.simpleEnterpriseName"></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="渠道代理">
                                    <el-select v-model="enterpriseInfo.channelAgent" placeholder="请选择" class="formSelect" value-key="value">
                                        <el-option
                                                v-for="item in channelAgentType"
                                                :key="item.value"
                                                :label="item.label"
                                                :value="item.value">
                                        </el-option>
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="注册业务员">
                                    <el-input type="text" v-model="enterpriseInfo.salesman"></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="邀请人">
                                    <el-input type="text" v-model="enterpriseInfo.inviterName" @change="checkInviter()" maxlength="11"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="业务员归属">
                                    <el-select v-model="enterpriseInfo.salesmanAffiliation" placeholder="请选择" class="formSelect" value-key="value">
                                        <el-option
                                                v-for="item in salesmanAffiliationType"
                                                :key="item.value"
                                                :label="item.label"
                                                :value="item.value">
                                        </el-option>
                                    </el-select>
                                </el-form-item>
                            </el-col>
                        </el-row>
                    </el-collapse-item>
                    <el-collapse-item name="3" v-show="memberState >= 3">
                        <template slot="title">
                            业务授权 <el-button size="small" type="primary" class="up_down_text">{{activeNames.indexOf('3') > -1 ? '收起' : '展开'}}<i :class="[activeNames.indexOf('3') > -1 ? 'el-icon-arrow-up' : 'el-icon-arrow-down']"></i></el-button>
                        </template>
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="经办人姓名">
                                    <el-input type="text" v-model="authInfo.agentTreasurerName"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="经办人手机号">
                                    <el-input type="text" v-model="authInfo.agentTreasurerPhone" maxlength="11"></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="经办人身份证号">
                                    <el-input type="text" v-model="authInfo.agentTreasurerCertNo" maxlength="18"></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                    </el-collapse-item>
                    <el-collapse-item name="4" v-show="memberState >= 4">
                        <template slot="title">
                            账户绑定 <el-button size="small" type="primary" class="up_down_text">{{activeNames.indexOf('4') > -1 ? '收起' : '展开'}}<i :class="[activeNames.indexOf('4') > -1 ? 'el-icon-arrow-up' : 'el-icon-arrow-down']"></i></el-button>
                        </template>
                        <el-table :data="relateInfo.bankAccounts">
                            <el-table-column prop="accountNumber" label="账号"></el-table-column>
                            <el-table-column prop="bankName" label="银行名称"></el-table-column>
                            <el-table-column prop="vAcctNo" label="虚拟号"></el-table-column>
                            <el-table-column prop="checkStatus" label="审核状态"></el-table-column>
                        </el-table>
                    </el-collapse-item>
                    <el-collapse-item name="5" v-show="memberState >= 2">
                        <template slot="title">
                            企业操作员 <el-button size="small" type="primary" class="up_down_text">{{activeNames.indexOf('5') > -1 ? '收起' : '展开'}}<i :class="[activeNames.indexOf('5') > -1 ? 'el-icon-arrow-up' : 'el-icon-arrow-down']"></i></el-button>
                        </template>
                        <el-table :data="enterpriseInfo.operators">
                            <el-table-column type='index' :index="indexMethod" label="序号"></el-table-column>
                            <el-table-column prop="isOperator" :formatter="isOperator" label="类型"></el-table-column>
                            <el-table-column prop="customerName" label="用户名"></el-table-column>
                            <el-table-column prop="phoneNumber" label="手机号"></el-table-column>
                            <el-table-column prop="bundlingTime" label="绑定时间"></el-table-column>
                        </el-table>
                    </el-collapse-item>
                </el-collapse>
                <el-row>
                    <el-steps direction="vertical" finish-status="finish">
                        <template v-if="memberState == 2">
                            <el-step status="finish"
                                     icon="iconfont icon-dian"
                                     v-for="(check, index) in enterpriseInfo.enterpriseCheck"
                                     :key="index"
                                     :title="check.checked_time"
                                     :description="check.description">
                            </el-step>
                        </template>
                        <template v-if="memberState == 3">
                            <el-step status="finish"
                                     icon="iconfont icon-dian"
                                     v-for="(check, index) in authInfo.agentTreasurerCheck"
                                     :key="index"
                                     :title="check.checked_time"
                                     :description="check.description">
                            </el-step>
                        </template>
                    </el-steps>
                </el-row>
                <template v-if="memberState > 1">
                    <el-col :span="24">
                        <el-form-item label="备注" prop="remark">
                            <el-input type="textarea" v-model="formData.remark"></el-input>
                        </el-form-item>
                    </el-col>
                </template>
            </el-form>
            <span slot="footer" class="dialog-footer submit-btn">
            <el-button size="small" type="info" @click="visible = false">取消</el-button>
            <template v-if="isModify">
                <el-button size="small" type="primary" @click="onSaveInfo">保存</el-button>
            </template>
            <template v-if="!isModify && memberState >= 2">
                <el-button size="small" type="danger" @click="onReject">不通过</el-button>
                <el-button size="small" type="primary" @click="onAccept">通过</el-button>
            </template>
        </span>
        </el-dialog>
        <ImagePreview ref="imagePreview" :image="this.previewImage"></ImagePreview>
    </div>
</template>

<script lang="ts">
    import { Vue, Component, Prop, Emit } from 'vue-property-decorator';
    import { State, Getter, Action, Mutation, namespace } from 'vuex-class';
    import ImageZoom from '@/component/common/ImageZoom.vue'
    import FormAddress from '@component/common/FormAddress.vue';
    import { licenceRegisterType, salesmanAffiliationType, channelAgentType } from '@/util/constantStatus'
    import { mapState, mapMutations, mapGetters, mapActions } from 'vuex';
    import { checkPhoneRex, checkPhoneRexInviter } from '@/util/format';
    import ImagePreview from '@component/common/imagePreview.vue';
    // import { NoCache } from '@/util/decorators'
    var memberStore = namespace('member')
    
    @Component({
        components: {
            ImageZoom,
            FormAddress,
            ImagePreview
        },
        computed: {
            ...mapState([
                'member'
            ])
        },
        methods: {
            ...mapActions([
                'getAllTips',
                'getMemberTips'
            ])
        }
    })
    export default class MemberModify extends Vue {
        // ------------------- data -------------------
        previewImage: string = ''
        activeNames = [ "1" ]
        // activeNames = [ "2", "3", "4", "5" ]
        @memberStore.State('memberDetail') memberDetail!:Array<object>
        // remark = ''
        visible = false
        isModify = true
        memberState = 1
        formData = {
            remark: ''
        }
        validateRules = {
            remark: [
                { required: false, message: '请输入备注', trigger: 'blur' },
                { max: 200, message: '长度在 200 个字符以内', trigger: 'blur' }
            ]
        }
        licenceRegisterType = licenceRegisterType
        salesmanAffiliationType = salesmanAffiliationType
        channelAgentType = channelAgentType
        cities = []             // options：可选数据源
        props = {               // props：是一个对象，相关配置如下
            value: 'id',
            label: 'address_name',
            children: 'cities'
        }
        initValue = []         // value：选中项绑定值

        isInviterName: boolean = false

        async handleItemChange (ids) {
            if(ids.length === 0){
                this.cities = await this.getAddr('0',false);
            }else if(ids.length === 1){
                if(ids[0] == 1 || ids[0] == 20 || ids[0] == 860 || ids[0] == 2462){
                    for (let i = 0; i < this.cities.length; i++) {
                        if (this.cities[i].id === ids[0]) {
                            this.cities[i].cities = await this.getAddr(ids[0]+1, true);
                        }
                    }
                }else{
                    for (let i = 0; i < this.cities.length; i++) {
                        if (this.cities[i].id === ids[0]) {
                            this.cities[i].cities = await this.getAddr(ids[0], false);
                        }
                    }
                }

            }else if (ids.length === 2) {
                for (let i = 0; i < this.cities.length; i++) {
                    if (this.cities[i].id === ids[0]) {
                        for (let j = 0; j < this.cities[i].cities.length; j++) {
                            if (this.cities[i].cities[j].id === ids[1]) {
                                this.cities[i].cities[j].cities = await this.getAddr(ids[1], true);
                            }
                        }
                    }
                }
            }
        }
        change (areas) {
            this.$emit('input', areas);
        }
        // 获取地址请求
        async getAddr (parentId, isEnd) {
            let response = await this.$http.get(`otherconstants/addressNext/${parentId}`)
            if(!isEnd){
                response.data.forEach(v => v.cities = []);
            }
            return response.data;
        }

        // ------------------- computed -------------------
        get customerInfo() {
            if (this.memberDetail[0] != undefined) {
                if (this.memberDetail[0].tradeLocationProvinceId != null) {
                    if (this.memberDetail[0].tradeLocationProvinceId == 1 || this.memberDetail[0].tradeLocationProvinceId == 20 || this.memberDetail[0].tradeLocationProvinceId == 860 || this.memberDetail[0].tradeLocationProvinceId == 2462) {
                        this.initValue = [this.memberDetail[0].tradeLocationProvinceId, this.memberDetail[0].tradeLocationId]
                        setTimeout(async () => {
                            for (let i = 0; i < this.cities.length; i++) {
                                if (this.cities[i].id === this.memberDetail[0].tradeLocationProvinceId) {
                                    this.cities[i].cities = await this.getAddr(this.memberDetail[0].tradeLocationProvinceId + 1, true);
                                }
                            }
                        },10)
                        this.$emit('input', this.initValue);
                    }else {
                        this.initValue = [this.memberDetail[0].tradeLocationProvinceId, this.memberDetail[0].tradeLocationCityId, this.memberDetail[0].tradeLocationId]
                        setTimeout(async () => {
                            for (let i = 0; i < this.cities.length; i++) {
                                if (this.cities[i].id === this.memberDetail[0].tradeLocationProvinceId) {
                                    this.cities[i].cities = await this.getAddr(this.memberDetail[0].tradeLocationProvinceId, false);
                                    for (let j = 0; j < this.cities[i].cities.length; j++) {
                                        if (this.cities[i].cities[j].id === this.memberDetail[0].tradeLocationCityId) {
                                            this.cities[i].cities[j].cities = await this.getAddr(this.memberDetail[0].tradeLocationCityId, true);
                                        }
                                    }
                                }
                            }
                        },10)
                        this.$emit('input', this.initValue);
                    }
                }
            }
            return this.memberDetail[0]
        }

        get enterpriseInfo() {
            if (this.memberState >= 2) {
                if (this.memberDetail[1].channelAgent == "" || this.memberDetail[1].channelAgent == null || this.memberDetail[1].channelAgent == undefined) {
                    this.memberDetail[1].channelAgent = '官方';
                }
                // if (this.memberDetail[1].salesman == "" || this.memberDetail[1].salesman == null || this.memberDetail[1].salesman == undefined) {
                //     this.memberDetail[1].salesman = "汇票线";
                // }
                // if (this.memberDetail[1].inviterName == "" || this.memberDetail[1].inviterName == null || this.memberDetail[1].inviterName == undefined) {
                //     this.memberDetail[1].inviterName = '120';
                // }
                return this.memberDetail[1]
            }
            return {
                enterpriseCheck: [],
                credentialPhotoAddress: '',
                artificialPersonFrontPhotoAddress: '',
                artificialPersonBackPhotoAddress: '',
                unifiedSocialCreditCode: '',
                licenceRegisterNo: '',
                organizationCodeNumber: '',
                licenceName: '',
                licenceAddr: '',
                legalName: '',
                legalCertNo: '',
                taxCertName: '',
                licenceType: '',
                foundedDate: '',
                licenceRegisterTypeId: '',
                corpId: '',
                enterpriseId: '',
                simpleEnterpriseName: '',
                channelAgent: '',
                salesman: '',
                inviterName: '',
                salesmanAffiliation: '',
                operators: []
            }
        }

        get authInfo() {
            if (this.memberState >= 3) {
                return this.memberDetail[2]
            }
            return {
                agentTreasurerName: '',
                agentTreasurerPhone: '',
                agentTreasurerCertNo: ''
            }
        }

        get relateInfo() {
            if (this.memberState >= 4) {
                return this.memberDetail[3]
            }
            return {
                bankAccounts: []
            }
        }

        // ------------------- methods -------------------
        indexMethod(index:number) {
            return index+1
        }

        isOperator(row:object, column:string, cellValue:number, index:number) {
            return cellValue == 0 ? '管理员' : '操作员'
        }

        /**
         * 单独更新会员信息
         */
        async onlyUpdateCustomerInfo(customerInfo) {
            let res = await this.$http.put('customers/customer/updateCustomer', customerInfo)
            this.requestResultPrompt(res)
        }

        /**
         * 修改会员 关联信息
         */
        async updateMemberInfo(data:any) {
            let res = await this.$http.post('hpxMemberReview/updateHpxMemberReviewInfo', data)
            this.requestResultPrompt(res)
        }

        /**
         * 审核会员 关联信息
         */
        async reviewMemberInfo(data:any) {
            let res = await this.$http.post('hpxMemberReview/checkHpxMemberReviewInfo', data)
            this.requestResultPrompt(res)
        }

        /**
         * 处理结果提示
         */
        requestResultPrompt(res) {
            if (res.status < 300) {
                this.$message(res.msg)
                this.close();
                this.getMemberTips()
                this.getAllTips()
                this.getMemberTips()
            }
        }

        /**
         * 获取提交数据
         */
        getSubmitData() {
            let customer = {
                id: this.customerInfo.customerId ,
                customer_name: this.customerInfo.customerName ,
                sex: this.customerInfo.sex ,
                id_number: this.customerInfo.idNumber ,
                email: this.customerInfo.email ,
                trade_location_id: this.customerInfo.tradeLocationId ,
                contact_address: this.customerInfo.contactAddress ,
                id_front_photo_id: this.customerInfo.frontPhotoId ,
                id_back_photo_id: this.customerInfo.backPhotoId ,
            }
            if (this.memberState == 1) {
                return customer;
            }
            let enterpriseXingYeUserReq = {
                enterprise_id: this.enterpriseInfo.enterpriseId ,
                credential_photo_id: this.enterpriseInfo.credentialPhotoId ,
                artificial_person_front_photo_id: this.enterpriseInfo.artificialPersonFrontPhotoId ,
                artificial_person_back_photo_id: this.enterpriseInfo.artificialPersonBackPhotoId ,
                unified_social_credit_code: this.enterpriseInfo.unifiedSocialCreditCode ,
                licence_register_no: this.enterpriseInfo.licenceRegisterNo ,
                organization_code_number: this.enterpriseInfo.organizationCodeNumber ,
                licence_name: this.enterpriseInfo.licenceName ,
                licence_addr: this.enterpriseInfo.licenceAddr ,
                legal_name: this.enterpriseInfo.legalName ,
                legal_cert_no: this.enterpriseInfo.legalCertNo ,
                tax_cert_name: this.enterpriseInfo.taxCertName ,
                licence_type: this.enterpriseInfo.licenceType ,
                // founded_date: this.enterpriseInfo.foundedDate ,
                founded_date: new Date(this.enterpriseInfo.foundedDate).valueOf() ,
                licence_register_type_id: this.enterpriseInfo.licenceRegisterTypeId ,
                simple_enterprise_name: this.enterpriseInfo.simpleEnterpriseName ,
                channel_agent: this.enterpriseInfo.channelAgent ,
                salesman: this.enterpriseInfo.salesman ,
                salesman_affiliation: this.enterpriseInfo.salesmanAffiliation ,
                inviter_phone: this.enterpriseInfo.inviterName
            }
            let enterpriseXingYeAgentTreasurerReq = {
                id: this.authInfo.agentTreasurerId ,
                agent_treasurer_name: this.authInfo.agentTreasurerName ,
                agent_treasurer_phone: this.authInfo.agentTreasurerPhone ,
                agent_treasurer_cert_no: this.authInfo.agentTreasurerCertNo ,
            }
            return {
                number: this.memberState == 2 ? 1 : 2, // 1 修改联系人 企业信息 2修改联系人 企业 经办人信息
                description: this.formData.remark,
                customer,
                enterpriseXingYeUserReq,
                enterpriseXingYeAgentTreasurerReq
            }
        }

        /**
         * 保存用户信息
         */
        async onSaveInfo(e) {
            let formValidate = await this.$refs['memberForm'].validate();
            if (!formValidate) {
                return false;
            }
            if (this.enterpriseInfo.inviterName == '' || this.enterpriseInfo.inviterName == null || this.enterpriseInfo.inviterName == '120') {
                this.isInviterName = true
            }
            if (!checkPhoneRexInviter(this.enterpriseInfo.inviterName) || !this.isInviterName) {
                this.$alert('请输入正确的邀请人手机号！','提示',{
                    confirmButtonText: '确定',
                    customClass: 'custom-message-box',
                    center: true,
                    callback: action => {}
                });
                return;
            }
            // 修改
            if (this.memberState === 1) {
                let data = this.getSubmitData()
                this.onlyUpdateCustomerInfo(data)
                return
            }
            if (this.memberState > 1) {
                let data = this.getSubmitData()
                this.updateMemberInfo(data)
                return
            }
        }

        /**
         * 审核通过
         */
        onAccept(e) {
            if (this.enterpriseInfo.inviterName == '' || this.enterpriseInfo.inviterName == null || this.enterpriseInfo.inviterName == '120') {
                this.isInviterName = true
            }
            if (!this.isInviterName || !checkPhoneRexInviter(this.enterpriseInfo.inviterName)) {
                this.$alert('请输入正确的邀请人手机号！','提示',{
                    confirmButtonText: '确定',
                    customClass: 'custom-message-box',
                    center: true,
                    callback: action => {}
                });
                return;
            }
            let data = this.getSubmitData();
            data.checkResult = 1;
            this.reviewMemberInfo(data);
        }

        /**
         * 审核不通过
         */
        onReject(e) {
            let data = this.getSubmitData();
            data.checkResult = -1;
            this.reviewMemberInfo(data);
        }

        /**
         * 关闭弹窗
         */
        onCloseDialog() {
            this.remark = ''
            this.$refs['imagePreview'].closeDialog();
            this.$refs['memberForm'].resetFields();
            this.close()
        }

        /**
         * 修改模式
         */
        open (memberState:number) {
            if (memberState === 2) {
                this.activeNames = [memberState.toString(), '5']
            } else {
                this.activeNames = [memberState.toString()]
            }
            this.memberState = memberState;
            this.visible = true;
        }

        /**
         * 审核模式
         */
        openReview(memberState:number) {
            this.isModify = false;
            this.open(memberState)
        }

        handleChange (val) {

        }

        // 校验邀请人手机号是否是平台会员
        async checkInviter () {
            if (this.enterpriseInfo.inviterName.length == 11) {
                let res = await this.$http.get(`hpxMemberReview/checkInviter/${this.enterpriseInfo.inviterName}`)
                if (res.status == 200) {
                    this.isInviterName = true
                }
            }
        }
        
        // 打开预览
        openPreview (data:string) {
            this.previewImage = '';
            this.previewImage = data;
            this.$refs['imagePreview'].openDialog()
        }

        close () {
            this.isModify = true;
            this.visible = false;
        }

        // ------------------- lifecycle -------------------
        mounted() {
            this.handleItemChange([]);
        }
    }
</script>

<style lang="scss" scope>
    .idCardImage {
        width:227px;
        height:143px;
    }
    .el-collapse-item__header::before {
        content: '';
        color: $__color-primary;
        width: 4px;
        height: 14px;
        background-color: $__color-primary;
        display: inline-block;
        margin-right: 8px;
    }
    .formSelect {
        width: 100%!important;
    }
    .otherInfo {
        border-top: 1px solid $__color-line;
    }
    .get-addr {
        .el-input__inner {
            width: 280px;
        }
    }
</style>
